<template>
<view>
  <view>
    this.$store.state.age：{{this.$store.state.age}}
  </view>
  <view>
    store.state.age：{{age2}}
  </view>
  <view>
    mapState：{{age3}}
  </view>
</view>
</template>

<script lang="ts">
import Vue from 'vue'
import store from '@/store/index';//需要引入store
import { mapState } from 'vuex'//引入mapState
export default Vue.extend({
  name: "vuex01",
  data(){
    return {
      age1: this.$store.state.age,
      age2: store.state.age
    }
  },
  computed: mapState({
    // 从state中拿到数据 箭头函数可使代码更简练
    username3: (state: any) => state.username,
    age3: (state: any) => state.age,
  })
})
</script>

<style scoped>

</style>
